import React from 'react';
import {IRouteComponentProps} from 'umi';
import styles from './index.less';

interface ICourseProps {
    url: string,
    [key: string]: any,
}

export default function (props: IRouteComponentProps) {
    const list = [
        "https://img.mukewang.com/szimg/5fb77efe0943fbad05400304.jpg",
        "https://img.mukewang.com/szimg/60793fca09fde18b05400304.jpg",
        "https://img.mukewang.com/szimg/607cf0c6092a5af105400304.jpg",
        "https://img.mukewang.com/szimg/6059a92e09bd086a05400304.jpg",
        "https://img.mukewang.com/szimg/6061507909dc082205400304.jpg",
        "https://img.mukewang.com/szimg/60497cca092fcd4805400304.jpg",
        "https://img.mukewang.com/szimg/603f61410977606f05400304.jpg",
        "https://img.mukewang.com/szimg/60223b8609a8ba1705400304.jpg",
    ];
    return (
        <ul className={styles.goods}>
            {list.map(_ => <Course url={_} key={_}/>)}
        </ul>
    );
}



function Course(props: ICourseProps) {
    return (
      <li>
        <div className={styles.goods_pic}>
          <img src={props.url} alt="" />
          <span className={styles.goods_views}>1888</span>
          <span className={styles.goods_type}>机构</span>
        </div>
        <p>Flutter高级进阶实战仿哔哩哔哩APP</p>
      </li>
    );
  }